<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="renderer" content="webkit">
    <title>金融风险监测预警平台v1.5-数据可视化大屏</title>
    <meta name="keywords" content="">
    <meta name="description" content="">
    <!--[if lt IE 9]>
    <meta http-equiv="refresh" content="0;ie.html"/>
    <![endif]-->
    <link rel="shortcut icon" href="../favicon.ico">
    <link href="../css/bootstrap.min.css?v=3.3.6" rel="stylesheet">
    <link href="../css/font-awesome.min.css?v=4.4.0" rel="stylesheet">
    <link href="../css/animate.css" rel="stylesheet">
    <link href="../css/style.css?v=4.1.0" rel="stylesheet">
    <link href="../js/plugins/tagcloud/jqcloud.css" rel="stylesheet"/>
</head>
<body>
<div class="loading" style="display: block">
    <div class="sk-spinner sk-spinner-three-bounce">
        <div class="sk-bounce1"></div>
        <div class="sk-bounce2"></div>
        <div class="sk-bounce3"></div>
        <span class="loading-text">加载中...</span></div>
</div>
<div class="bigdataBox">
    <div class="bigdata_header">
        <div class="col-md-3 text-left todayWeek" id="todayWeek"></div>
        <div class="col-md-6 text-center header_title bigdataColor">金融风险监测预警平台数据可视化大屏</div>
        <div class="col-md-3 text-right closeBigdataBox"><a id="closeBigdataBox" title="退出"><i
                class="fa fa-sign-out fa-lg bigdataColor"></i></a></div>
    </div>
    <div class="bigdata_content">
        <div class="row">
            <div class="col-md-2">
                <div class="echarts" style="height: 219px" id="company-pie-chart">
                </div>
                <div class="echarts" style="height: 219px" id="risk-pie-chart">
                </div>
            </div>
            <div class="col-md-6 furongmapWrap text-center no-padding"
                 style="background: url(../img/title_bg.png) left top no-repeat">
                <div id="furongmap" style="height: 450px;padding:3px 0 0 3px;">

                </div>
            </div>
            <div class="col-md-4" style="padding-left:0;background: url(../img/title_bg.png) left top no-repeat">
                <div class="echarts" id="echarts-line-chart" style="height: 210px;"></div>
                <div class="mt-12"
                     style="font-size: 15px;color:#ffffff;font-weight: bold;padding:5px 0 6px 30px;background: url(../img/title_bg.png) left top no-repeat;">
                    舆情热词
                </div>
                <div class="echarts" id="echarts-wordcloud-chart" style="height: 188px;"></div>
            </div>
        </div>
        <div class="row">
            <div class="col-md-5" style="padding-right: 0">
                <div class=""
                     style="font-size: 15px;color:#ffffff;font-weight: bold;padding:5px 0 6px 23px;margin-left:10px;background: url(../img/title_bg.png) left top no-repeat;">
                    舆情网络来源
                </div>
                <div class="echarts" id="echarts-bar-chart" style="height: 230px">
                </div>
            </div>
            <div class="col-md-3 no-padding">
                <div class=""
                     style="font-size: 15px;color:#ffffff;font-weight: bold;padding:5px 0 6px 23px;background: url(../img/title_bg.png) left top no-repeat;">
                    舆情情感占比
                </div>
                <div class="echarts" style="height: 230px" id="echarts-pie-chart">
                </div>
            </div>
            <div class="col-md-4 no-padding">
                <div class=""
                     style="font-size: 15px;color:#ffffff;font-weight: bold;padding:5px 0 6px 30px;background: url(../img/title_bg.png) left top no-repeat;">
                    舆情热点
                    <div class="scroltit">
                        <i class="fa fa-angle-up" title="向上" id="but_down"></i><i class="fa fa-angle-down" title="向下"
                                                                                  id="but_up"></i>
                    </div>
                </div>

                <div class="scrollbox">
                    <div id="scrollDiv">
                        <ul class="no-padding">
                            <li class="rgba"><i>1</i><a href="#" class="linktit">目前民间集资是否全部可以定性为非法集资? - 知乎</a></li>
                            <li><i>2</i><a href="#" class="linktit">年化利率居然72%!非法集资500亿!它们才是最大集资诈骗..._搜狐财经</a></li>
                            <li class="rgba"><i>3</i><a href="#" class="linktit">非法集资,重判还是轻责_检察日报社多媒体数字报刊平台</a></li>
                            <li><i>4</i><a href="#" class="linktit">企业自众筹一不小心变非法集资,很危险</a></li>
                            <li class="rgba"><i>5</i><a href="#" class="linktit">一图看懂非法集资 如何保护你的钱袋子?--财经--人民网</a></li>
                            <li><i>6</i><a href="#" class="linktit">2017e租宝最新消息,非法集资真相大白,返还比例多少</a></li>
                            <li class="rgba"><i>7</i><a href="#" class="linktit">2018年,这几部法规将左右互联网金融格局</a></li>
                            <li><i>8</i><a href="#" class="linktit">非法集资罪量刑标准,非法集资和集资诈骗罪的区别</a></li>
                            <li class="rgba"><i>9</i><a href="#" class="linktit">处理非法集资的风暴即将来临,不懂这条规定,或血本无归!</a></li>
                            <li><i>10</i><a href="#" class="linktit">国务院关于进一步做好防范和处置非法集资工作的意见</a></li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
    </div>

</div>
<style>
    body {
        overflow: hidden;
    }

    .bigdataColor {
        color: #0afbd1;
    }

    .todayWeek {
        font-size: 14px;
        color: #ffffff;
        line-height: 65px;
    }

    .bigdataBox {
        position: relative;
        width: 100%;
        height: 100%;
        background-size: cover;
        background-image: url("../img/bgs/bigdata_3.jpg");
    }

    .bigdataBox .bigdata_header {
        width: 100%;
        height: 50px;
        border-bottom: 1px solid #0afbd1;
        position: fixed;
        z-index: 999999;
    }

    .header_title {
        font-size: 24px;
        line-height: 50px;
    }

    .closeBigdataBox {
        line-height: 65px;
    }

    .bigdata_content {
        position: absolute;
        top: 50px;
        padding-top: 10px;
        width: 100%;
        height: 100%;
        overflow-y: auto;
    }

    /*轮播舆情*/
    .scrollbox {
        width: 100%;
        height: 200px;
        margin: 0 auto;
        overflow: hidden;
    }

    /*这里的高度和超出隐藏是必须的*/
    #scrollDiv li {
        width: 95%;
        height: 30px;
        line-height: 28px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        zoom: 1;
        margin-top: 10px;
        border: 1px #2db9a6 solid;
        border-radius: 0 0 10px 0;
        background-color: rgba(69, 221, 200, 0.45);
    }

    #scrollDiv li:hover, #scrollDiv li.rgba:hover {
        background-color: rgba(69, 221, 200, 0.8);
        cursor: pointer;
    }

    #scrollDiv li.rgba {
        background-color: rgba(69, 221, 200, 0.2);
    }

    #scrollDiv li i {
        display: inline-block;
        width: 30px;
        height: 30px;
        background-color: #2db9a6;
        text-align: center;
        color: #ffffff;
        font-size: 16px;
        font-weight: bold;
        margin-right: 10px;
    }

    #scrollDiv li a {
        color: #ffffff;
        text-decoration: none
    }

    #scrollDiv li a:hover {
        color: #ffffff;
    }

    .scroltit {
        float: right;
        height: 26px;
        line-height: 26px;
        margin-right: 24px;
    }

    .scroltit i {
        font-size: 24px;
        color: #2db9a6;
    }

</style>
<!-- 全局js -->
<script src="../js/jquery.min.js?v=2.1.4"></script>
<script src="../js/plugins/screenfull/screenfull.js"></script>
<!-- ECharts -->
<script src="../js/plugins/echarts/echarts-all-3.js"></script>
<script src="../js/plugins/echarts/echarts-wordcloud.js"></script>

<script src="../js/plugins/autoscroll/jq_scroll.js"></script>
<!-- 自定义js -->
<script src="../js/loading.js?v=4.1.0"></script>
<!-- ECharts demo data -->
<script src="../js/demo/echarts-risk-demo-index.js"></script>
</body>
</html>
